<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>public</title>
    <link href="./layui/css/layui.css" rel="stylesheet">
    <!--<style>
        .layui-header{
            background: #00FF00;
        }
        .layui-side{
            background: #0000FF;
        }
        .layui-body{
            background: #C2BE9E;
        }
        .layui-footer{
            background: #eb7350;
        }
    </style>-->
</head>
<body>
<iframe src="body1.html" id="iframe1"></iframe>
<div class="layui-layout-admin layui-layout">
    <!-- 1. 顶部-->
    <div class="layui-header">
        <div class="layui-nav">
            <div class="layui-nav-item">
                <a href="">控制台<span class="layui-badge">9</span></a>
            </div>
            <div class="layui-nav-item">
                <a href="">个人中心<span class="layui-badge-dot"></span></a>
            </div>
            <div class="layui-nav-item layui-col-md-offset8">
                <a href=""><img src="//t.cn/RCzsdCq" class="layui-nav-img">我</a>
                <dl class="layui-nav-child">
                    <dd><a href="javascript:;">修改信息</a></dd>
                    <dd><a href="javascript:;">安全管理</a></dd>
                    <dd><a href="javascript:;">退了</a></dd>
                </dl>
            </div>
        </div>
    </div>

    <!-- 2. 左侧-->
    <div class="layui-side layui-bg-black">
        <div class="layui-nav layui-nav-tree" lay-filter="test">
            <!-- 侧边导航: <ul class="layui-nav layui-nav-tree layui-nav-side"> -->
            <div class="layui-nav-item layui-nav-itemed">
                <a href="javascript:;">默认展开</a>
                <dl class="layui-nav-child">
                    <dd><a href="javascript:;">选项1</a></dd>
                    <dd><a href="javascript:;">选项2</a></dd>
                    <dd><a href="">跳转</a></dd>
                </dl>
            </div>
            <div class="layui-nav-item">
                <a href="javascript:;">解决方案</a>
                <dl class="layui-nav-child">
                    <dd><a href="">移动模块</a></dd>
                    <dd><a href="">后台模版</a></dd>
                    <dd><a href="">电商平台</a></dd>
                </dl>
            </div>
            <div class="layui-nav-item"><a href="">产品</a></div>
            <div class="layui-nav-item"><a href="">大数据</a></div>
        <div/>
    </div>

    <!-- 3. 主体-->
    <div class="layui-body">
        <!--<iframe src="body1.html"></iframe>-->
    </div>

    <!-- 4. 底部-->
    <div class="layui-footer"></div>
</div>


<script src="./layui/layui.js"></script>
</body>
</html>